<template>
  <div>
    <el-card>
      <h2 style="text-align: center">实验室借用申请表单</h2>
      <el-form label-width="100px" :model="tableData">
        <el-form-item label="实验室编号" prop="laboratory_id">
          <el-input v-model="tableData.laboratory_id" disabled></el-input>
        </el-form-item>
        <el-form-item label="课程名称" prop="course_name">
          <el-input v-model="tableData.course_name" disabled></el-input>
        </el-form-item>
        <el-form-item label="学生班级编号" prop="class_id">
          <el-input v-model="tableData.class_id" disabled></el-input>
        </el-form-item>
        <el-form-item label="人数" prop="number">
          <el-input v-model="tableData.number" disabled></el-input>
        </el-form-item>
        <el-form-item label="实验目的" prop="purpose">
          <el-input v-model="tableData.purpose" disabled></el-input>
        </el-form-item>
        <el-form-item label="电话" prop="phone">
          <el-input v-model="tableData.phone" disabled></el-input>
        </el-form-item>
        <el-form-item
          label="开始使用时间（第几节课）"
          prop="start_class"
          style="width: 40%; display: inline-block; margin-left: 0%"
          label-width="53%"
        >
          <el-input v-model="tableData.start_class" disabled></el-input>
        </el-form-item>
        <el-form-item
          label="结束使用时间（第几节课）"
          prop="end_class"
          style="width: 40%; display: inline-block; margin-left: 20%"
          label-width="53%"
        >
          <el-input v-model="tableData.end_class" disabled></el-input>
        </el-form-item>
        <el-form-item label="审批结果:" id="add">
          <div style="font-size: 22px; text-align: left; margin-left: 15px">
            {{ this.tableDataReason }}
          </div>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: {},
      tableDataReason: {},
    };
  },
  created() {
    this.getList();
  },
  methods: {
    async getList() {
      const { data: res } = await this.$http.post(
        "/api/student/selectlabloan",
        {
          form_id: sessionStorage.getItem("LabBorrow"),
        }
      );
      if (res.code !== 200) {
        return this.$message.error("获取实验室借用申请信息失败！");
      }
      this.$message.success("成功获取实验室借用申请信息！");
      this.tableData = res.data;
      this.tableDataReason=sessionStorage.getItem('reason')
    },
  },
};
</script>
<style scoped>
.el-card {
  width: 60%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
</style>